<template>
  <!--  发货区域，支持选择快递-->
  <j-modal
    switchFullscreen
    width="60%"
    :title="title"
    :visible="visible"
    @cancel="handleCancel"
    :confirmLoading="confirmLoading"
  >
    <template slot="footer">
      <a-button @click="handleCancel">取消</a-button>
      <a-button @click="handleOk" type="primary" v-if="!disableSubmit">确认</a-button>
    </template>
    <a-form :form="form">
      <a-row :gutter="24">
        <!--        承运方式-->
        <a-col :md="12" :sm="24">
          <a-form-item
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
            label="费用类型"
            hasFeedback
          >
            <a-select placeholder="请选择费用类型" @change="moneyCost"  v-decorator="['type',{initialValue:1, ...validatorRules.type}]">
              <a-select-option :value="1">
                折扣
              </a-select-option>
              <a-select-option :value="2">
                货补
              </a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :md="12" :sm="24">
          <a-form-item
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
            label="费用池余额"
            hasFeedback
          >
            <a-input placeholder="请选输入余额" :disabled="disableSubmits"  v-decorator="['balance']"></a-input>
          </a-form-item>
        </a-col>
        <a-col :md="12" :sm="24" v-if="zhekou">
          <a-form-item
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
            label="商品编号"
          >
            <a-input-search placeholder="请选择商品" v-decorator="['productCode',validatorRules.productCode]"
                            readOnly :disabled="disableSubmits" enter-button @search="productSearch('product')" />
          </a-form-item>
        </a-col>

        <a-col :md="12" :sm="24" v-if="zhekou">
          <a-form-item
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
            label="商品名称"
            hasFeedback
          >
            <a-input placeholder="请选择商品" :disabled="true"
                     v-decorator="['productName',validatorRules.productName]"></a-input>
          </a-form-item>
        </a-col>
        <a-col :md="12" :sm="24">
          <a-form-item
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
            label="经销商名称"
          >
            <a-input-search v-decorator="['custName',validatorRules.custName]" placeholder="请选择经销商名称"
                            readOnly :disabled="disableSubmits" enter-button @search="custSearch('custname')" />
          </a-form-item>
        </a-col>
        <a-col :md="12" :sm="24">
          <a-form-item
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
            label="经销商编号"
            hasFeedback
          >
            <a-input :disabled="true" placeholder="请选择经销商名称"
                     v-decorator="['custCode',validatorRules.custCode]"></a-input>
          </a-form-item>
        </a-col>



        <!--<a-col :md="12" :sm="24">-->
          <!--<a-form-item-->
            <!--:labelCol="labelCol"-->
            <!--:wrapperCol="wrapperCol"-->
            <!--label="价格"-->
            <!--hasFeedback-->
          <!--&gt;-->
            <!--<a-input placeholder="请输入" type="number" :disabled="disableSubmit" @change="e => priceCh(e)" v-decorator="['price',validatorRules.price]"></a-input>-->
          <!--</a-form-item>-->
        <!--</a-col>-->
        <!--<a-col :md="12" :sm="24">-->
          <!--<a-form-item-->
            <!--:labelCol="labelCol"-->
            <!--:wrapperCol="wrapperCol"-->
            <!--label="开始时间"-->
            <!--hasFeedback-->
          <!--&gt;-->
            <!--&lt;!&ndash;            :disabled-date="disabledDate&ndash;&gt;-->
            <!--<a-date-picker style="width: 100%" format="YYYY-MM-DD" showTime valueFormat="YYYY-MM-DD"-->
                           <!--:disabled="disableSubmit" v-decorator="['startTime', validatorRules.startTime]"-->
                           <!--placeholder="点击选择开始时间" />-->
          <!--</a-form-item>-->
        <!--</a-col>-->
        <!--<a-col :md="12" :sm="24">-->
          <!--<a-form-item-->
            <!--:labelCol="labelCol"-->
            <!--:wrapperCol="{-->
        <!--xs: { span: 24 },-->
        <!--sm: { span: 18 }-->
      <!--}"-->
            <!--label="结束时间"-->
            <!--hasFeedback-->
          <!--&gt;-->
            <!--<a-date-picker style="width: 100%" format="YYYY-MM-DD" showTime valueFormat="YYYY-MM-DD"-->
                           <!--:disabled="disableSubmit" v-decorator="[ 'endTime',validatorRules.endTime]"-->
                           <!--placeholder="点击选择结束时间" />-->
          <!--</a-form-item>-->
        <!--</a-col>-->
        <!--<a-col :md="12" :sm="24">-->
          <!--<a-form-item-->
            <!--:labelCol="labelCol"-->
            <!--:wrapperCol="wrapperCol"-->
            <!--label="价格单位"-->
            <!--hasFeedback-->
          <!--&gt;-->
            <!--<cn-dict-select-tag :options="{value:'dictDataCode',label:'dictDataDesc'}" :triggerChange="true"-->
                               <!--dictCode="product_saleUnit"-->
                               <!--:disabled="disableSubmit" v-decorator.trim="['unitName', validatorRules.unitName]"-->
                               <!--placeholder="请选择价格单位" />-->
          <!--</a-form-item>-->
        <!--</a-col>-->
        <!--        <a-col :md="12" :sm="24">-->
        <!--          <a-form-item-->
        <!--            :labelCol="labelCol"-->
        <!--            :wrapperCol="wrapperCol"-->
        <!--            label="erp凭证码"-->
        <!--            hasFeedback-->
        <!--          >-->
        <!--            <a-input placeholder="请输入erp凭证码" :disabled='disableSubmit'-->
        <!--                     v-decorator="['erpKey',validatorRules.erpKey]"></a-input>-->
        <!--          </a-form-item>-->
        <!--        </a-col>-->
      </a-row>
    </a-form>
    <proChose ref="prochoose" @okbro="okbropro"></proChose>
  </j-modal>
</template>

<script>
import { getAction, postAction } from '@/api/manage'
import proChose from '@comp/cn-components/ProChose'
import { pick } from 'lodash'

export default {
  name: 'ReplenishModal',
  description:'货补新增',
  components: {
    proChose
  },
  data() {
    return {
      disableSubmit: false,
      disableSubmits: false,
      title: '',
      confirmLoading: false,
      form: this.$form.createForm(this),
      model: {},
      visible: false,
      labelCol: {
        xs: { span: 24 },
        sm: { span: 6 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 18 }
      },
      url: {
        // kuaidi: window._CONFIG['domianOrderURL'] + '/cnDictionaryTypeController/getDictionaryTypeList'
        sendOrder: window._CONFIG['domianDmsURL'] + '/dmsFeePoolController/saveEntity'
      },
      validatorRules: {
        productCode: {
          rules: [
            { required: true, message: '' }
          ]
        },
        productName: {
          rules: [
            { required: true, message: '' }
          ]
        },
        custCode: {
          rules: [
            { required: true, message: '' }
          ]
        },
        custName: {
          rules: [
            { required: true, message: '' }
          ]
        },
        channelCode: {
          rules: [
            { required: true, message: '' }
          ]
        },
        price: {
          rules: [
            { required: true, message: '' }
          ]
        },
        startTime: {
          rules: [
            { required: true, message: '' }
          ]
        },
        endTime: {
          rules: [
            { required: true, message: '' }
          ]
        },
        unitName: {
          rules: [
            { required: true, message: '' }
          ]
        }
      },
      modal: undefined,
      ismoneyOR:1,
      zhekou:false,
    }
  },
  watch:{
    ismoneyOR:{
      immediate:true,
      deep:true,
      handler(val){
       if(val == 1){
         this.zhekou = false
       }else{
         this.zhekou = true
       }
      }
    }
  },
  methods: {
    moneyCost(e){
      this.ismoneyOR = e

    },
    priceCh(e){
      console.log(e.target.value)
      let num = e.target.value
      if(num < 0){
        this.$nextTick(()=>{
          this.form.setFieldsValue({
            price:0
          })
        })
      }
    },
    custSearch(status) {
      this.$refs.prochoose.rowKey='custCode'
      let formconfig = [
        {
          key: 'custCode',
          label: '经销商编号'
        },
        {
          key: 'custName',
          label: '经销商名称'
        }
      ]
      let tableconfig = {
        columns: [
          {
            title: '经销商编号',
            align: 'center',
            dataIndex: 'custCode',
            width: 120,
            ellipsis: true
          },
          {
            title: '经销商名称',
            align: 'center',
            dataIndex: 'custName',
            width: 120,
            ellipsis: true
          }
        ],

        list: window._CONFIG['domianURL'] + '/customerController/getPageList',
        multiple: false,
        columW: 8
      }
      let dataSource = []
      if(this.form.getFieldValue('custCode')){
        dataSource = [{
          custCode:this.form.getFieldValue('custCode'),
          custName:this.form.getFieldValue('custName')
        }]
      }
      this.name = '经销商'
      this.$refs.prochoose.edit(formconfig, tableconfig, status)
    },
    productSearch(status) {
      this.$refs.prochoose.rowKey='productCode'
      let formconfig = [
        {
          key: 'productCode',
          label: '商品编号'
        },
        {
          key: 'productName',
          label: '商品名称'
        }
      ]
      let tableconfig = {
        columns: [
          {
            title: '商品编号',
            align: 'center',
            dataIndex: 'productCode',
            width: 120,
            ellipsis: true
          },
          {
            title: '商品名称',
            align: 'center',
            dataIndex: 'productName',
            width: 120,
            ellipsis: true
          }
        ],
        list: window._CONFIG['domianURL'] + '/goods/cnGoods/findPageList',
        multiple: false,
        columW: 8
      }
      this.name = '商品'
      let dataSource = []
      if(this.form.getFieldValue('productCode')){
        dataSource = [{
          productCode:this.form.getFieldValue('productCode'),
          productName:this.form.getFieldValue('productName')
        }]
      }
      this.$refs.prochoose.edit(formconfig, tableconfig, status,dataSource)
    },
    okbropro(record, status) {
      let res = record[0]
      if (status == 'product') {
        this.form.setFieldsValue(pick(res, 'productCode', 'productName'))
      } else {
        this.form.setFieldsValue(pick(res, 'custCode', 'custName',))
        console.log(this.form.getFieldValue('channelName'))
      }

    },
    add(record, status) {
      this.edit(record, status)
    },
    edit(iscord) {
      this.disableSubmits = false
      this.form.resetFields()
      this.modal = undefined
      this.visible = true
      if (typeof iscord !== 'undefined') {
        this.disableSubmits = true
        this.modal = Object.assign({}, iscord)
        this.$nextTick(() => {
          this.form.setFieldsValue({ ...this.modal })
        })
      }
    },
    handleOk() {
      let _vm = this
      this.form.validateFields((err, values) => {
        if (!err) {
          this.confirmLoading = true
          this.modal == undefined ? console.log('新增提交') : values.id = this.modal.id
          postAction(this.url.sendOrder, values).then(res => {
            if (!res.success) {
              this.$message.error(res.message)
            } else {
              this.$emit('ok')
            }
            _vm.confirmLoading = false
          })
        }
      })
    },
    handleCancel() {
      this.visible = false
      this.confirmLoading = false
    },
    close() {
      this.handleCancel()
    }
  }

}
</script>

<style scoped>

</style>